lengthChance("pro-name",30)
lengthChance("pro-address",130)
lengthChance("pro-linkman" ,30)
lengthChance("pro-phone" ,11)
lengthChance("pro-id",18)
proDataCall(proShow)
$("#pro-pageSize").on("change",function(){
    proDataCall(proShow)
})
proFind()
function proFind(){
    $("#proFind").on("click",function(){
        proDataCall(proShow)
    })
}
function proShow(data){ 
    console.log(data)
    var proFlag =1
    let activeNum =1
    let leftNum =4;
    let rightNum=4
    $(".total").text("共"+data.total+"条")
    // data.pages;
    // console.log(data.pages)
    if(data.pages>9){
        // console.log(222)
            showLi(proFlag);
    }else{
        // console.log(111,data.pages)
        sShowLi(data.pages)
    }

    function sShowLi(num){
        console.log(data)
        $("#liWrapper").html("")
      for (let index = 0; index <num; index++) {
        $("#liWrapper").append("<li>"+(index+1)+"</li>")   
      }
      $("#liWrapper").on("click","li",function(){
          $(this).addClass("active").siblings().removeClass("active")
         proDataCall(toSShowLi)

      })
      tabShow(data)
      function toSShowLi(newData){
        tabShow(newData)
      }
      sToNext()
      function sToNext(){
          $(".pro-btn-next").on("click",function(){
            $("#liWrapper li.active").removeClass("active").next().addClass("active")
            proDataCall(toSShowLi)
          })
       
      }
      sToPrev()
      function sToPrev(){
          $(".pro-btn-prev").on("click",function(){
            $("#liWrapper li.active").removeClass("active").prev().addClass("active")
            proDataCall(toSShowLi)
          })
       
      }
      if( $("#liWrapper li:first-child")[0]){
        $("#liWrapper li:first-child")[0].click()
      }
}



if(data.pages>9){
    $("#liWrapper").on("click","li",function(){
        // console.log((proFlag))
        // console.log($(this).text())
         activeNum = $(this).text()
        if($(this).text()<=leftNum){
            proFlag = 1
        }else if($(this).text()>(data.pages-rightNum)){
            proFlag = 0
        }
        else if($(this).text()==="···"){
            proFlag = -1
        }
        else{
            proFlag = $(this).text()
        }
        // console.log( proFlag)
    })
    $("#liWrapper").on("click","li",function(){
        if(data.pages>7){
            showLi(proFlag);
    }else{
        for (let index = 0; index <data.pages ; index++) {
            $("#liWrapper").append("<li>"+(index+1)+"</li>")
        }
    }
    })
}
       
        function showLi(num){
            $("#liWrapper").html("")
            if(num == 1){
                for (let index = 0; index < 6; index++) {
                    $("#liWrapper").append("<li>"+(index+1)+"</li>") 
                }
                $("#liWrapper").append("<li class='pro-toNext'>···</li>") 
                $("#liWrapper").append("<li>"+data.pages+"</li>")
                
            }else if(num==0){
                $("#liWrapper").append("<li>1</li>") 
                $("#liWrapper").append("<li class='pro-toPrev'>···</li>") 
                for (let index = data.pages-6; index < data.pages; index++) {
                    $("#liWrapper").append("<li>"+(index+1)+"</li>") 
                }
             }else if(num==-1){

             }else{
                $("#liWrapper").append("<li>1</li>") 
                $("#liWrapper").append("<li class='pro-toPrev'>···</li>")
                for (let index=(num-2); index<(+num+3); index++) {
                    $("#liWrapper").append("<li>"+(index)+"</li>") 
            }
                $("#liWrapper").append("<li class='pro-toNext'>···</li>")
                $("#liWrapper").append("<li>"+data.pages+"</li>")
        }
        iftopOrBottom()
        proLiColor()
        function proLiColor() {  
            $("#liWrapper li").each(function(index,el){
                if($(el).text()==activeNum){
                    $(el).addClass("active")
                }
    
            })
        }

        function ellipsisFun(){
            $("#liWrapper .pro-toNext").on("mouseenter",function (){
                $(this).text(">>").css("color","#7AC8F9")
              })
            $("#liWrapper .pro-toNext").on("mouseleave",function (){
                $(this).text("···").css("color","black")
              })
            $("#liWrapper .pro-toNext").on("click",function (){
                proFlag= +proFlag+5;
                if(proFlag>(data.pages-rightNum-5)){
                    activeNum = data.pages;
                    showLi(0);
                }else{
                    activeNum = proFlag;
                    showLi(proFlag);
                }
                
              })

            $("#liWrapper .pro-toPrev").on("mouseenter",function (){
                $(this).text("<<").css("color","#7AC8F9")
              })
            $("#liWrapper .pro-toPrev").on("mouseleave",function (){
                $(this).text("···").css("color","black")
              })
              $("#liWrapper .pro-toPrev").on("click",function (){
                proFlag=activeNum-5;
                if(proFlag<=leftNum){
                    activeNum =1;
                    showLi(1);   
                }else{
                    activeNum = proFlag;
                    showLi(proFlag);
                }

              })

        }
        ellipsisFun()
        function iftopOrBottom() {
            if(activeNum<=1){
                activeNum=1
                $(".pro-btn-prev").css({
                        "cursor":"not-allowed",
                        "color":"#D6CECF"
                    });
                   
            }else{
                $(".pro-btn-prev").css({
                    "cursor":"pointer",
                    "color":"#000000"
                });
            }
            if(activeNum>=data.pages){
                activeNum = data.pages;
                $(".pro-btn-next").css({
                    "cursor":"not-allowed",
                    "color":"#D6CECF"
                })
            }else{
                $(".pro-btn-next").css({
                    "cursor":"pointer",
                    "color":"#000000"
                });
            }
        }
        
        $("#proGoto").val(activeNum)
        proDataCall(tabShow)
}

if(data.pages>9){
    proGoto()
    upAndDown()
    profun()
}

function proGoto(){
    $("#proGoto").on("focus",function(){
        $(this).css({"borderColor":"#409EFF","outline":"#409EFF"})
    })
    $("#proGoto").on("blur",function(){
        $(this).css({"borderColor":"#DCDFE6"})
        let val = +$(this).val()
        if(val%1==0){
            activeNum = val;
            if(val<=4){
                showLi(1)
            }
            else if(val>=data.pages-rightNum){
                showLi(0)
            }
            else{
                showLi(val)
            }
        }else{
            $(this).css("borderColor","red")
        }
        
    })
}

    function upAndDown(){
        $(".pro-btn-prev").on("click",function(){
            activeNum--
            if(activeNum<=4){
                showLi(1)
            }
            else if(activeNum>=data.pages-rightNum){
                showLi(0)
            }
            else{
                showLi(activeNum)
            }
        proDataCall(tabShow)
            
        })
        $(".pro-btn-next").on("click",function(){
            activeNum++
            if(activeNum<=4){
                showLi(1)
            }
            else if(activeNum>=data.pages-rightNum){
                showLi(0)
            }
            else{
                showLi(activeNum)
            }
        proDataCall(tabShow)
            
        })
    }

    if($("#liWrapper li.active")[0]){
        $("#liWrapper li.active")[0].click();
    }

 }
function profun(){ 
    $(".pro-btn-prev").on("click",function(){
        proDataCall(tabShow)
    })
    $(".pro-btn-next").on("click",function(){
        proDataCall(tabShow)
    })
    $("#liWrapper").on("click","li",function(){
        proDataCall(tabShow)
    })
 }

 function tabShow(data){

     if(data){
        let arr = data.list;
            $("#pro-tbody").html("")
    $(arr).each(function(index,el){
        let tr =$("<tr><td>"+el.subjectName+"</td><td>"+el.subjectLinkman+"</td><td>"+el.subjectTele+"</td><td>"+el.subjectTypeName+"</td><td>"+el.subjectType+"</td><td>"+el.subjectBase+"</td><td>"+el.subjectAddr+"</td><td><button>查看</button><button>编辑</button></td></tr>")
        $("#pro-tbody").append(tr)
    })
     }
}
